<!DOCTYPE html>
<html lang="zh-CN">

<head>
    <meta charset="UTF-8">
    <title>组织结构信息</title>
    <link rel="stylesheet" href="css/reset.css">
    <link rel="stylesheet" href="css/public.css">
    <link rel="stylesheet" href="css/structural.css">
</head>

<body>
    <header class="tophead">
        <div class="w header">
            <div class="logo">
                <img src="image/logo.png" alt="logo">
            </div>
            <ul class="header-nav">
                <li>HR中心</li>
                <li class="nav-active">应聘管理</li>
                <li>职位管理</li>
                <li>发布职位</li>
                <li>入职管理</li>
                <li>管理系统</li>
            </ul>
            <div class="inform">
                <img src="image/inform.png" alt="通知">
            </div>
        </div>
    </header>
    <!-- 此处为版心,侧边与主板块共用-->
    <div class="w clearfix">
        <nav class="sidebar">
            <div class="sidebar-title">系统管理</div>
            <div class="sidebar-pie">
                <p class="sidebar-pie-title color">企业信息</p>
            </div>
            <div class="sidebar-pie">
                <p class="sidebar-pie-title">组织结构</p>
            </div>
            <div class="sidebar-pie">
                <p class="sidebar-pie-title">角色权限</p>
            </div>
            <div class="sidebar-pie">
                <p class="sidebar-pie-title">账号管理</p>
            </div>
        </nav>
        <div class="plate">
            <div class="content">
                <div class="search">
                    <button class="search-btn">查询</button>
                    <div class="keyword-box">
                        <span class="keyword-label">角色名称</span>
                        <input type="text" class="keyword">
                    </div>
                </div>
                <div class="role-list">
                    <span class="role1">角色列表</span>
                    <div class="role2">
                        <span>导出</span>
                        <span>添加</span>
                    </div>
                </div>
                <table class="table">
                    <thead class="table-h">
                        <tr>
                            <th><span>角色名称</span><span class="down"></span></th>
                            <th><span>角色类型</span><span class="down"></span></th>
                            <th><span>备注说明</span><span class="down"></span></th>
                            <th><span>修改</span><span class="down"></span></th>
                            <th><span>删除</span><span class="down"></span></th>
                        </tr>
                    </thead>
                    <tbody class="table-b">
                        <tr class="body-tr">
                            <td class="body-td">宿舍管理员</td>
                            <td class="body-td">设备使用人员</td>
                            <td class="body-td">管理宿舍事物</td>
                            <td class="body-td"><span class="orange">修改</span></td>
                            <td class="body-td"><span class="blue">删除</span></td>
                        </tr>
                        <tr class="body-tr">
                            <td class="body-td">宿舍管理员</td>
                            <td class="body-td">设备使用人员</td>
                            <td class="body-td">管理宿舍事物</td>
                            <td class="body-td"><span class="orange">修改</span></td>
                            <td class="body-td"><span class="blue">删除</span></td>
                        </tr>
                    </tbody>
                </table>
            </div>
            <div class="page">
                <div class="page-state">
                    <div class="page-btn">
                        <span class="btn1"></span>
                        <span class="btn2"></span>
                        <span class="btn3"></span>
                        <span class="btn4"></span>
                    </div>
                    <div class="two">第1/1页&nbsp;每页显示
                        <input type="text" value="15">条</div>
                    <div class="three">共3条</div>
                    <div class="four">转到
                        <input type="text" value="5">页</div>
                    <div class="five">确定</div>
                </div>
            </div>
        </div>
    </div>
</body>

</html>